<template>
  <Dialog :appDialog="appDialog">
    <el-form :form="form">
      <el-form-item label="员工每日添加上限">
        <el-input v-model="form.num" placeholder="员工每日添加上限" @input="inputNum"></el-input>
      </el-form-item>
    </el-form>
  </Dialog>
</template>
<script setup lang="ts">
import { ElMessage } from "element-plus";
import { ref, reactive, computed, watch } from "vue";
import Dialog from "@/components/Dialog.vue";

const emit = defineEmits(["submit"]);
const batchVisible = ref(false)
const form = reactive({
  num:200,
});
const inputNum = (num:any)=>{
  num = num.replace(/\D/g,'')
  if(num>=200){
    num=200
  }
  if(num<=1){
    num = 1
  }
  form.num = num
}
// 取消
const cancelHandel = () => {
  form.num = 200;
  batchVisible.value = false;
};
//确定删除
const submitHandel = async () => {
  emit("submit",form.num);
  cancelHandel()
};
const appDialog = reactive({
  visible: batchVisible,
  title: "批量操作",
  width: "400px",
  cancel: cancelHandel,
  submit: submitHandel,
  cancelText: "取消",
  submitText: "确定",
});
defineExpose({
  batchVisible,
});
</script>
<style lang="scss" scoped>
.content {
  min-height: 100px;
  line-height: 25px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}
</style>
